<template>
    <listPage :page='pageReq' @pageChange='pageChange' >

        <template #bar >
            <checkBoxs :src="statusMap" v-model="searchData.status">状态: </checkBoxs>
        </template>

        <template #sort >
            <sortGroup v-model='sorts' @change='groupChange'>
                <sortTag :value='"inputDate"'>
                    时间
                </sortTag>
                <sortTag :value='"num"'>
                    点赞
                </sortTag>
                <sortTag :value='"type"'>
                    类型
                </sortTag>
            </sortGroup>
        </template>

        <template #button >
            <Input class='pp'>
                <template #append >
                    <Button type='primary' @click='findAll' >检索</Button>
                </template>
            </Input>
        </template>

        <template #table >
            <div v-for='v in listData' :key='v.id' class='item' >
                <listItem :value='v' ></listItem>
            </div>
        </template>

        <template #other >
            <div>
                发布新问题
                <addForm :api='api' @success='findAll'>
                    <template #default="slot">
                        <formItemList v-model="slot.model"></formItemList>
                    </template>
                </addForm>
            </div>
        </template>

    </listPage>    
</template>
<script>
import listPage from '#/list-page';

import addForm from '##/form/add';

import sortTag from '@@/sort/sortTag';
import sortGroup from '@@/sort/sortGroup';
import checkBoxs from '@@/check/box';

import listItem from './components/listItem';
import formItemList from './components/formItemList';
//import formItemList from './components/formItemList';

export default {
    components:{
        listPage,
        sortTag,
        sortGroup,
        checkBoxs,
        listItem,
        addForm,
        formItemList,
    },
    data(){
        return {
            sorts:[],
            listData:[],
            pageReq:{
                pageNum:1,
                pageSize:20,
            },
            searchData:{
                status:[],
            },
            statusMap:{
                "有效":"有效",
                "进行中":"进行中",
                "关闭":"关闭",
            },
            api: {
                getById: id => this.$post("question/getById", id),
                add: item => this.$post("question/add", item)
            },
        }
    },
    mounted(){
        this.findAll();
    },
    methods:{
        groupChange(k,v,i){
            this.findAll();
        },
        pageChange(e){
            this.findAll();
        },
        findAll(){
            this.$post('/question/getByOther',{
                ...this.searchData,
                pageReq:{
                    ...this.pageReq,
                    sorts:this.sorts,
                },
            }).then(res=>{
                this.listData = res.list;
                this.pageReq.pageNum = res.pageNum;
                this.pageReq.pageSize = res.pageSize;
                this.pageReq.total = res.total;
            });
        },
    }
}
</script>
<style lang="less" scoped>
    .item {
        margin: 10px;
    }
</style>


